<template>
	<el-form label-width="330px" :model="form" :rules="rules" ref="queryForm" @submit.prevent>

		<el-row>
			<el-col :span="24">
				<el-form-item label="行政区域" prop="district">
					<el-select v-model="form.district" size="default" placeholder="请选择" style="width: 220px" clearable
						filterable>
						<el-option v-for="item in XzqOptions" :key="item.dictValue" :label="item.dictLabel"
							:value="item.dictValue" />
					</el-select>
				</el-form-item>
			</el-col>
		</el-row>
		<el-row>
			<el-col :span="24">
				<el-form-item label="人防工程能力标准(标准建设面积（万㎡）" prop="rfgcnlbzmj">
					<el-input v-model="form.rfgcnlbzmj" style="width:220px;"
					@input="e => regOnlyNumSpot(e, form, 'rfgcnlbzmj', 2)"></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		
		<el-row>
			<el-col :span="24">
				<el-form-item label="人防工程需求清单(需要增加的防护面积（万㎡)" prop="rfgcxqmj">
					<el-input v-model="form.rfgcxqmj" style="width:220px;"
					@input="e => regOnlyNumSpot(e, form, 'rfgcxqmj', 2)"></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		
		<el-row>
			<el-col :span="24">
				<el-form-item label="人防工程需求清单(可以隐蔽的人数)" prop="rfgcxqybrs">
					<el-input v-model="form.rfgcxqybrs" style="width:220px;"
					@input="e => regOnlyNumSpot(e, form, 'rfgcxqybrs', 2)"></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		
		
		<el-row>
			<el-col :span="24">
				<el-form-item label="隐蔽场所能力标准(建设面积（万㎡）" prop="ybcsnlbzmj">
					<el-input v-model="form.ybcsnlbzmj" style="width:220px;"
					@input="e => regOnlyNumSpot(e, form, 'ybcsnlbzmj', 2)"></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		
		
		<el-row>
			<el-col :span="24">
				<el-form-item label="隐蔽场所需求清单(需要增加的防护面积（万㎡)" prop="ybcsnlxqmj">
					<el-input v-model="form.ybcsnlxqmj" style="width:220px;"
					@input="e => regOnlyNumSpot(e, form, 'ybcsnlxqmj', 2)"></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		
		
		<el-row>
			<el-col :span="24">
				<el-form-item label="疏散地域能力标准（需要接受多少万人）" prop="ybcsxqybrs">
					<el-input v-model="form.ybcsxqybrs" style="width:220px;"
					@input="e => regOnlyNumSpot(e, form, 'ybcsxqybrs', 2)"></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		
		
		<el-row>
			<el-col :span="24">
				<el-form-item label="疏散地域需求清单（需要扩增接收人口数量(万人)" prop="ssdynlbz">
					<el-input v-model="form.ssdynlbz" style="width:220px;"
					@input="e => regOnlyNumSpot(e, form, 'ssdynlbz', 2)"></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		
		
		<el-row>
			<el-col :span="24">
				<el-form-item label="疏散基地能力需求（需要建设疏散基地数量（个)" prop="ssdynlxq">
					<el-input v-model="form.ssdynlxq" style="width:220px;"
					@input="e => regOnlyNumSpot(e, form, 'ssdynlxq', 2)"></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		
		
		<el-row>
			<el-col :span="24">
				<el-form-item label="人防工程现有能力(建设面积（万㎡）" prop="rfgcxymj">
					<el-input v-model="form.rfgcxymj" style="width:220px;"
					@input="e => regOnlyNumSpot(e, form, 'rfgcxymj', 2)"></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		
		
		<el-row>
			<el-col :span="24">
				<el-form-item label="隐蔽场所现有标准(建设面积（万㎡）" prop="xyybcsmj">
					<el-input v-model="form.xyybcsmj" style="width:220px;"
					@input="e => regOnlyNumSpot(e, form, 'xyybcsmj', 2)"></el-input>
				</el-form-item>
			</el-col>
		</el-row>
		
		
		

		
		
		
		

		

		<div style="display: flex;justify-content: flex-end;">
			<el-button @click="closethis()" @keyup.prevent @keydown.enter.prevent>取消</el-button>
			<el-button type="primary" @click="submit(queryForm)" @keyup.prevent @keydown.enter.prevent>确定</el-button>
		</div>

	</el-form>
</template>

<script setup>
	import {
		ref,
		reactive,
		onMounted
	} from 'vue'
	import {
		ElMessage
	} from 'element-plus'

	import {
		commonInterface
	} from '@/api/common/common'

	import {
		regOnlyNumSpot
	} from '@/utils/reg'

	const emit = defineEmits(['getList', 'closeWindow'])
	const props = defineProps(['editData', 'XzqOptions'])

	const form = ref({})

	const queryForm = ref('')
	const XzqOptions = ref()

	//必填项
	const rules = reactive({
		district:[{
			required: true,
			message: "此选项不能为空!",
			trigger: "change"
		}],
		name: [{
			required: true,
			message: "此选项不能为空!",
			trigger: "change"
		}]
	})
	//取消
	const closethis = () => {
		emit('closeWindow')
	}

	//确定
	const submit = async (e) => {
		if (!e) return
		await e.validate((valid) => {
			if (valid) {
				let method = 'post'
				if (props.editData) method = 'put'
				commonInterface('/back/renfang/rfzh/xsBzRyfhnlxq/', form.value, method).then(result => {
					if (result.code === 200) {
						ElMessage.success(result.msg)
						emit('closeWindow')
						emit('getList')
					} else {
						ElMessage.error(result.msg)
					}
				})
			}
		})
	}

	onMounted(() => {
		XzqOptions.value = props.XzqOptions
		if (props.editData) form.value = props.editData
	})
</script>

<style lang="scss" scoped>
</style>